<template>
  <div>
    <h2>员工列表</h2>
    <p>欢迎您: {{loginName}}</p>
    <div>
      <el-form  :inline="true"  size="mini" class="demo-form-inline">
        <el-form-item label="姓名">
          <el-input v-model="ename" placeholder="请输入姓名"></el-input>
        </el-form-item>
        <el-form-item label="部门">
          <el-select v-model="deptId" placeholder="请选择部门">
            <el-option label="请选择" value="0"></el-option>
            <el-option v-for="d in dlist" :label="d.dname" :value="d.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click.prevent="search">查询</el-button>
        </el-form-item>
      </el-form>
    </div>

    <div>
      {{elist}}
    </div>

    <div>
      <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pageNum"
          :page-sizes="[2, 4, 8, 16]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  name: "Emp" ,
  data(){
    return {
      ename:'' ,
      deptId :'0',
      dlist:[] ,
      elist:[],
      pageNum:1,
      pageSize:2,
      total:0 ,
      loginName:''
    }
  },
  methods:{
    handleSizeChange(size){
      this.pageNum = 1;
      this.pageSize = size ;
      this.initEmp();
    },
    handleCurrentChange(now){
      this.pageNum = now ;
      this.initEmp();
    },
    search(){
      this.pageNum = 1;
      this.initEmp();
    },
    initDept(){
      let url = "/dept/list"
      this.$axios.get(url).then((res)=>{
        console.log(res)
       /* if (res.data == 'noLogin') {
          alert("请去登录!");
        }*/
        if (res.data.code == 200) {
          this.dlist = res.data.data ;
        }else {
          this.$message({
            type:'error',
            message:res.data.msg,
            duration:1000
          })
        }
      })
    },
    initEmp(){
      let url = "/emp/list"
      this.$axios.get(url,{
        params:{
          ename:this.ename,
          deptId:this.deptId,
          now:this.pageNum,
          size:this.pageSize
        }
      }).then((res)=>{
        console.log(res)
        if (res.data.code == 200) {
          this.elist = res.data.data.list ;
          this.pageNum = res.data.data.pageNum;
          this.pageSize = res.data.data.pageSize;
          this.total = res.data.data.total ;
        }else {
          this.$message({
            type:'error',
            message:res.data.msg,
            duration:1000
          })
        }
      })
    },
    initLoginName(){
      //let token = sessionStorage.getItem("token");

    }
  },
  created() {
    this.initEmp();
    this.initDept();
  }
}
</script>

<style scoped>

</style>